<template>
  <div class="logistics">
    <div>包裹1</div>
    <el-form :model="formInline" class="demo-form-inline" label-position="top">
      <el-form-item label=" " class="itemCol">
        <el-radio-group v-model="radio1" class="ml-4">
          <el-radio :value="1" size="large">邮寄</el-radio>
          <el-radio :value="2" size="large">线下取药</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="包裹信息" class="itemCol">
        <el-table :data="tableData" style="width: 100%" :border="true">
          <el-table-column prop="type_name" label="处方" />
          <el-table-column prop="detail" label="处方编号" />
          <el-table-column prop="order_sn" label="药态" />
          <el-table-column prop="num" label="总剂数" />
          <el-table-column prop="pay_moneys" label="是否代加工" />
          <el-table-column prop="zip" label="本次快递剂数" />
          <el-table-column prop="zip" label="期望送达时间" />
        </el-table>
      </el-form-item>
      <el-form-item label="收货地址" class="itemCol">
        <el-table :data="tableData2" style="width: 100%" :border="true">
          <el-table-column prop="type_name" label=" " width="60px">
            <template #default="{ row }">
              <el-radio v-model="selectedAddress"></el-radio>
            </template>
          </el-table-column>
          <el-table-column prop="type_name" label="收件人" />
          <el-table-column prop="detail" label="收件人手机" />
          <el-table-column prop="order_sn" label="所在地区" />
          <el-table-column prop="num" label="详细地址" />
          <el-table-column prop="aaa" label="默认地址	" width="160">
            <template #default>
              <el-radio-group v-model="radio2" class="ml-4">
                <el-radio :value="1" size="large">设为默认地址</el-radio>
              </el-radio-group>
            </template>
          </el-table-column>
          <el-table-column fixed="right" label="Operations" width="120">
            <template #default>
              <el-button link type="primary" size="small" @click="handleClick">
                删除
              </el-button>
              <el-button link type="primary" size="small">编辑</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form-item>
      <el-form-item label="优惠金额:" class="itemCol row">
        <el-text>111</el-text>
      </el-form-item>
      <el-form-item label="支付类型:" class="itemCol row">
        <el-text>111</el-text>
      </el-form-item>
      <el-form-item label="支付方式:" class="itemCol row">
        <el-text>¥111</el-text>
      </el-form-item>
      <el-form-item label="线上支付:" class="itemCol marginL20 row">
<!--        <el-text>¥{{dataAll.total_money}}</el-text>-->
      </el-form-item>
      <el-form-item label="优惠:" class="itemCol marginL20 row">
        <el-text>¥111</el-text>
      </el-form-item>
    </el-form>
  </div>
</template>

<script setup>
  import {
    ref,
    nextTick,
    onMounted,
    reactive
  } from 'vue'
  const selectedAddress = ref(null)
  const formInline = ref({})
  const radio1 = ref(1)
  const radio2 = ref(null)
  const tableData = ref([])
  const tableData2 = ref([{
    id: 1,
    aaa: null
  }, {
    id: 2,
    aaa: null
  }])
</script>

<style lang="scss" scoped>
  .row {
    display: flex;
    flex-direction: row;
  }

  .row ::v-deep .el-form-item__label {
    margin-bottom: 0 !important;
    display: flex;
    align-items: center;
  }

  .marginL20 {
    margin-left: 20px;
  }
</style>